<template>
  <div class="itemlist">
    <!-- {{ $route.query.maitKey}} -->
    <div class="box" v-for="(item, index) in itemList" :key="index">
      <img :src="item.image" alt="" />
      <p>{{ item.title }}</p>
    </div>
  </div>
</template>

<script>
import { queryItem } from "@/plugins/api/index";
export default {
  name: "Listitem",
  data() {
    return {
      id: "",
      itemList: "",
    };
  },
  mounted() {
    this.id = this.$route.query.maitKey;
     this.requestItem();
  },
  methods: {
    //标题 详情
    requestItem() {
      queryItem( this.$route.query.maitKey).then((res) => {
        console.log(res);
        this.itemList = res.data.data.list;
        // console.log(this.itemList);
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.itemlist {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  margin: 10px ;
//   justify-content: space-around;
  .box {
    // border: 1px solid red;
    width: 30%;
    img {
      width: 100%;
    //   border: 1px solid red;
      border-radius:50px ;
    }
    p{
        text-align: center;
    }
  }
}
</style>